<template>
  <div class="default_reply">
    <h3>设置开启条件</h3>
    <el-form :model="termForm" label-width="100px">
      <el-form-item label="分时段开启">
        <el-time-select
          placeholder="起始时间"
          v-model="termForm.startTime"
          :picker-options="{
            start: '00:00',
            step: '00:30',
            end: '23:30'
          }">
        </el-time-select>
        <el-time-select
          placeholder="结束时间"
          v-model="termForm.endTime"
          :picker-options="{
            start: '00:00',
            step: '00:30',
            end: '24:00',
            minTime: termForm.startTime
          }">
        </el-time-select>
      </el-form-item>
      <el-form-item label="周几生效">
        <el-checkbox v-model="termForm.mon" :true-label="1" :false-label="0">一</el-checkbox>
        <el-checkbox v-model="termForm.tue" :true-label="1" :false-label="0">二</el-checkbox>
        <el-checkbox v-model="termForm.wed" :true-label="1" :false-label="0">三</el-checkbox>
        <el-checkbox v-model="termForm.thu" :true-label="1" :false-label="0">四</el-checkbox>
        <el-checkbox v-model="termForm.fri" :true-label="1" :false-label="0">五</el-checkbox>
        <el-checkbox v-model="termForm.sat" :true-label="1" :false-label="0">六</el-checkbox>
        <el-checkbox v-model="termForm.sun" :true-label="1" :false-label="0">七</el-checkbox>
      </el-form-item>
      <el-form-item label="不重复回复">
        <el-col :span="2"><el-input-number v-model="termForm.intervalTime" :controls="false" style="width:100%;" placeholder="请输入整数"></el-input-number></el-col>
        <el-col :span="10">&emsp;分钟内只答复一次</el-col>
      </el-form-item>
    </el-form>
    <h3>设置回复内容</h3>
    <editor-lite ref="editor" :showNews="false" :editorData="defaultReply"></editor-lite>
    <el-button @click="handleSave" type="primary" :loading="isSave">保存</el-button>
    <el-button @click="handleDelReply(defaultReply.status)">{{defaultReply.status==1 ? '停用' : '启用'}}</el-button>
  </div>
</template>
<script>
  import {mapMutations, mapActions, mapState} from 'vuex'
  import editorLite from '@/components/common/content/wechatEditorLite2'
  export default {
    data () {
      return {
        appid: this.$route.params.appid,
        termForm: {
          startTime: null,
          endTime: null,
          intervalTime: null,
          mon: 0,
          tue: 0,
          wed: 0,
          thu: 0,
          fri: 0,
          sat: 0,
          sun: 0
        },
        isSave: false
      }
    },
    mounted () {
      this.getDefaultReply(this.appid)
    },
    components: {editorLite},
    watch: {
      defaultReply () {
        Object.assign(this.termForm, this.defaultReply)
      }
    },
    computed: {
      ...mapState({
        defaultReply: state => state.wechatManage.defaultReply
      }),
      startTime: {
        get () {
          return this.$store.state.wechatManage.startTime
        },
        set (val) {
          this.UPDATE_DEFAULT_REPLY({startTime: val})
        }
      }
    },
    methods: {
      ...mapMutations(['UPDATE_DEFAULT_REPLY', 'SET_SOURCE_INFO', 'INIT_SOURCE_INFO']),
      ...mapActions(['getDefaultReply', 'setDefaultReply', 'setIfDefaultReply']),
      // 保存
      async handleSave () {
        if (!Number.isInteger(+this.termForm.intervalTime)) {
          this.$message.warning('间隔时间不合法')
          return false
        }
        if (this.$refs.editor.getContent.msgType === 'text' && !document.getElementById('editDiv').innerHTML) {
          this.$message.warning('请输入回复内容')
          return false
        }
        if (this.$refs.editor.getContent.msgType !== 'text' && !this.$refs.editor.getContent.mediaid) {
          this.$message.warning('请选择回复内容')
          return false
        }
        this.isSave = true
        const res = await this.setDefaultReply({
          ...this.termForm,
          appid: this.appid,
          msgType: this.$refs.editor.getContent.msgType,
          mediaid: this.$refs.editor.getContent.mediaid,
          content: this.convertSpecials(document.getElementById('editDiv').innerHTML)
        })
        this.isSave = false
        if (res.data.code === 1) {
          this.$message.success('保存成功')
        }
      },
      /**
      * 转移链接里面的特殊符号
      **/
      convertSpecials(str){
        var arrEntities={'lt':'<','gt':'>','nbsp':' ','amp':'&','quot':'"'}
        return str.replace(/&(lt|gt|nbsp|amp|quot);/ig,function(all,t){return arrEntities[t];})
      },
      // 删除回复
      handleDelReply (status) {
        this.setIfDefaultReply({
          appid: this.appid,
          status: status === 1 ? 0 : 1
        })
      }
    }
  }
</script>
<style lang="scss">
  .default_reply{
    h3{margin-bottom:20px;}
  }
</style>
